<template>
    <div>
       <!-- tab栏 -->
      	 <div class="head">
  	        <image :src="src1" class="headd" resize="cover" @click="back()"></image>
  	        <text class="head1">变更手机号</text>
      	 </div>
	       <text class="num">注册手机号:</text>
         <input type="text" placeholder="请输入手机号" class="num_inp" />
         <text class="change" :class="change1">变更手机号</text>
         <text class="tip">变更手机号成功后可使用新号码登录</text>
    </div>
</template>
<style scoped>
  .head{
      width: 100%;
      height: 48px;
      padding-top: 12px;
      box-sizing: border-box;
      line-height: 32px;
      flex-direction: row;
      justify-content: center;
      align-items: center;
      box-shadow: 1px 1px 1px #ccc;
      background-color: #fff;
    }
    .headd{
      width: 15px;
      height: 20px;
      position: absolute;
      left: 12px;
    }
    .head1{
      font-size: 20px;
      font-weight: bold;
      color: #33c179;
    }
    .num{
      height: 15px;
      line-height: 15px;
      font-size: 15px;
      color: #666;
      margin-left: 21px;
      margin-top: 26px;
      font-weight: bold;
    }
    .num_inp{
      width: 300px;
      height: 24px;
      color: #333;
      line-height: 24px;
      margin-left: auto;
      margin-right: auto;
      margin-top: 54px;
      text-align: center;
    }
    .change{
      height: 31px;
      width: 119px;
      line-height: 31px;
      text-align: center;
      background-color: #999;
      font-size: 14px;
      font-weight: bold;
      margin-left: auto;
      margin-right: auto;
      margin-top: 54px;
      color: #fff;
      border-radius: 25px;
    }
    .change1{
      background-color: #33c179;
    }
    .tip{
      height: 12px;
      line-height: 12px;
      color: #999;
      font-size: 12px;
      margin-left: auto;
      margin-right: auto;
      margin-top: 20px;
    }
    
</style>
<script>
  export default {
    data () {
        return {
            src1: 'http://192.168.2.123:8080/img/index_back.png',//返回
           	src2: 'http://192.168.2.123:8080/img/accountmanagement_phone.png', //变更手机号图标
           	src3: 'http://192.168.2.123:8080/img/accountmanagement_password.png', //修改密码图标
           	src4: 'http://192.168.2.123:8080/img/ABOUT_return.png',//前进按钮
            change1: '',
            show012: true,
        }
    },
    components: {
       
    },
    created () {
        
    },
    methods: {
      // 点击返回
      back(){
        this.$router.back(-1);
      },
      // 点击变更手机号图标
      changephone(){
      	this.$router.push('/');
      }
    }
}
</script>